<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
	<title>YongYuan | Resume</title>
	<link rel="shortcut icon" href="../favicon.ico">

	<!-- Add your CSS files here -->
	<link rel="stylesheet" href="css/normalize.min.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/themes/green.css">

	<!-- Add your Fonts here -->
	<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>

</head>
<body>


<div class="top-bar">
<!--    {% if page.language == 'fr' %}
    En septembre, venez apprendre ou progresser en <a href="http://surfcamp.lewagon.org"><strong>code</strong> & en <strong>surf</strong></a> !
    {% else %}
    In September, come to France to <a href="http://surfcamp.lewagon.org"><strong>code</strong> & <strong>surf</strong></a>!
    {% endif %}-->
  </div>

  <div class="header-container">
    <header class="inner">
      <nav>
        <a href="/">About</a>
        <a href="/project/">Project</a>
        <!--<a class="{% if page.category == 'resume' %} selected {% endif %}" href="/resume/">Resume</a>-->
		<a href="/resume/">Resume</a>
        <a href="/publication/">Publication</a>
        <a href="/blog/">Blog</a>
        <!--<a class="{% if page.category == 'contact' %} selected {% endif %} contact" href="/contact/">Contact</a>-->
        <a href="https://github.com/willard-yuan">Github</a>
      </nav>
      <div class="pull-right right logo">
        <div class="name">
          <a href="/">Yong Yuan</a><br />
          <small>
            <em>
              <!--{% if page.url == '/cn/index.html' %}
                <a href="/cn">developer & designer</a>
              {% else %}-->
                <a href="/">developer & designer</a>
              <!--{% endif %}-->
            </em>
          </small>
        </div>
        <img class="avatar" src="/images/YongYuan.png" alt="My profile picture" />
      </div>
      <div class="clear"></div>
    </header>
    <div class="clear"></div>
  </div>


<!--<div class="settings">
	<a href="resume.html#" class="icon-cog"></a>
	<span class="themes">
		<a href="resume.html#" class="theme" data-color="red">Theme Red</a>
		<a href="resume.html#" class="theme" data-color="green">Theme Green</a>
		<a href="resume.html#" class="theme" data-color="blue">Theme Blue</a>
		<a href="resume.html#" class="theme" data-color="white">Theme White</a>
		<a href="resume.html#" class="theme" data-color="rose">Rose Color</a>
		<a href="resume.html#" class="theme" data-color="aqua">Aqua Color</a>
		<a href="resume.html#" class="theme" data-color="orange">Orange Color</a>
	</span>
</div>-->

<div class="container">

	<!--<div class="logo"><img src="img/logo.svg" alt="Logo"></div>-->

	<!-- <div class="social">
		<a href="http://facebook.com/rocketthemes" class="icon-facebook" title="Facebook"></a>
		<a href="http://twitter.com/rocketthemes" class="icon-twitter" title="Twitter"></a>
		<a href="resume.html#" class="icon-googleplus" title="Googleplus"></a>
		<a href="resume.html#" class="icon-dribbble" title="Dribbble"></a>
		<a href="resume.html#" class="icon-behance" title="Behance"></a>
		<a href="resume.html#" class="icon-instagram" title="Instagram"></a>
		<a href="resume.html#" class="icon-flickr" title="Flickr"></a>
	</div>
	Social Icons End -->

	<!-- <header>
		<nav id="nav">
			<ul class="nav">
				<li><img src="img/logo.svg" alt="My Logo"></li>
				<li><a href="index.html" class="icon-user"><span>Profile</span></a></li>
				<li><a href="work.html" class="icon-briefcase"><span>Work</span></a></li>
				<li class="active"><a href="resume.html" class="icon-list"><span>Resume</span></a></li>
				<li><a href="contact.html" class="icon-mail"><span>Contact</span></a></li>
			</ul>
		</nav>
	</header>
	Header End -->

	<section class="content">
		<article class="career">
			<h2>My career</h2>
			<ul class="ro-timeline">
				<li>
					<div class="ro-time"><span>2012 - 2013</span></div>
					<div class="ro-icon icon-briefcase"></div>
					<div class="ro-label">
						<h3>Frontend Developer<span>Example Inc.</span></h3>
						<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum, maiores sint possimus distinctio tenetur in magni animi pariatur sed. Consequatur, earum, sunt a tenetur.</p>
					</div>
				</li>
				<li>
					<div class="ro-time"><span>2012</span></div>
					<div class="ro-icon icon-briefcase"></div>
					<div class="ro-label">
						<h3>Javascript Ninja<span>Google Inc.</span></h3>
						<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas, officia, recusandae quam laudantium eos et laboriosam aut vel ipsam commodi voluptatem sit repellendus blanditiis nobis eius!</p>
					</div>
				</li>
				<li>
					<div class="ro-time"><span>2010 - 2011</span></div>
					<div class="ro-icon icon-briefcase"></div>
					<div class="ro-label">
						<h3>Junior Frontend Developer<span>Facebook Inc.</span></h3>
						<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas, officia, recusandae quam laudantium eos et laboriosam aut vel ipsam commodi voluptatem sit repellendus blanditiis nobis eius!</p>
					</div>
				</li>
			</ul>

			<h2>My education</h2>
			<ul class="ro-timeline">
				<li>
					<div class="ro-time"><span>2013 - Now</span></div>
					<div class="ro-icon icon-graduation"></div>
					<div class="ro-label">
						<h3>Signal Processing Master<span>UCAS</span></h3>
						<p>Now I am a 2nd year postgraduate student at Chinese Academy of Sciences. My research interests cover Multimedia Information Retrieval(focus on image retrieval based on CBIR), Computer Vision. In my free time, I dive into web development and programming. The two years study makes me know what I'm really inerested in.</p>
					</div>
				</li>
				<li>
					<div class="ro-time"><span>2009 - 2013</span></div>
					<div class="ro-icon icon-graduation"></div>
					<div class="ro-label">
						<h3>Faculty of Science B.Sc.<span>Xidian University</span></h3>
						<p>I majored in science and technology of the electronics information at Xidian University. During the four years in University,
						I grew up fleetly. The extracurricular time in school library enriched my mind and broadened my horizons. After that I was recommended to Chinese Academy of Sciences.</p>
					</div>
				</li>
			</ul>

		</article>
		<!-- Timeline End -->

		<aside class="sidebar">
			<h2>My skills</h2>
			<h3 class="test"><span class="icon-text-2"></span>Programming</h3>
			<ul class="ratings">
				<li>
					<h5>HTML</h5>
					<div class="rating" data-rating="7">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>
				<li>
					<h5>CSS</h5>
					<div class="rating" data-rating="7">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>
				<li>
					<h5>Python</h5>
					<div class="rating" data-rating="6">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>
				<li>
					<h5>Django</h5>
					<div class="rating" data-rating="6">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>
				<li>
					<h5>C++</h5>
					<div class="rating" data-rating="5">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>
				<li>
					<h5>Git</h5>
					<div class="rating" data-rating="7">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>				
				<li>
					<h5>Matlab</h5>
					<div class="rating" data-rating="8">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</li>
			</ul>

			<h3 class="test"><span class="icon-brush"></span>Graphic Design</h3>
			<ul class="skills">
				<li><span data-skill="90">Photoshop</span></li>
				<li><span data-skill="80">Illustrator</span></li>
			</ul>

			<h3 class="test"><span class="icon-tools"></span>Other skills</h3>
			<ul class="skills">
				<li><span data-skill="92">Web Design</span></li>
				<li><span data-skill="96">Web Development</span></li>
				<li><span data-skill="85">Jekyll</span></li>
				<li><span data-skill="81">Graphic Design</span></li>
			</ul>
		</aside>
		<!-- Sidebar End -->

	</section>
	<!-- Content End -->

</div>
<!-- Container End -->


<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/plugins.js"></script>

<script>
      var navigation = responsiveNav("#nav", {
        animate: true,        // Boolean: Use CSS3 transitions, true or false
        transition: 400,      // Integer: Speed of the transition, in milliseconds
        label: "",            // String: Label for the navigation toggle
        insert: "before",     // String: Insert the toggle before or after the navigation
        customToggle: "",     // Selector: Specify the ID of a custom toggle
        openPos: "relative",  // String: Position of the opened nav, relative or static
        jsClass: "js",        // String: 'JS enabled' class which is added to <html> el
        init: function(){},   // Function: Init callback
        open: function(){},   // Function: Open callback
        close: function(){}   // Function: Close callback
      });
</script>

</body>
</html>
